<template>
  <div id="bugHome">
    <b-header></b-header>
    <div class="body bg-color-gray">
      <div class="menu lf" :style="{ height: height }">
        <happy-scroll color="rgba(141, 196, 235, .5)" resize>
          <div id="asd123">
            <el-menu :router="true" style="width: 175px" :unique-opened="true" :default-active="path" >
              <el-submenu :index="index + ''" v-for="(item, index) in data" :key="item.id">
                <template slot="title">
                  <span>{{ item.obj.name }}</span>
                </template>
                <el-menu-item-group>
                  <el-menu-item :index="val.obj.url || '#'" v-for="val in item.children" :key="val.id" @click.native="updatePath(val.obj.url)">{{ val.obj.name }}</el-menu-item>
                </el-menu-item-group>
              </el-submenu>
            </el-menu>
          </div>
        </happy-scroll>
      </div>
      <div class="body-header" :style="{ height: height }">
        <router-view/>
      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  import BHeader from '../../components/BHeader/BHeader'
  import ajax from '../../api/ajax/ajax'
  import api from '../../api/url'
  import { mapMutations, mapState } from 'vuex'
  import { nextPage } from '../../assets/js/index'

  export default {
    components: {
      BHeader
    },
    data () {
      return {
        data: [],
        height: null
      }
    },
    computed: {
      ...mapState([
        'path'
      ])
    },
    methods: {
      ...mapMutations([
        'pb_updateSysName'
      ]),
      // 获取当前系统
      getCurrSystem () {
        ajax.post(api.BUG_GETMENU, { sys_no: 'M202' }).then(res => {
          this.data = res.data
        })
      },
      // 页面跳转
      updatePath (url) {
        nextPage(url)
      }
    },
    created () {
      this.pb_updateSysName('诊断')
      this.getCurrSystem()
      this.height = window.innerHeight - 70 + 'px'
      window.onresize = () => {
        this.height = window.innerHeight - 70 + 'px'
      }
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus">
  #bugHome
    .body
      overflow hidden
      .menu
        width 200px
        background #fff
        padding 10px
        overflow auto
        .el-menu
          border-right solid 0
          .el-submenu__title
            font-size 16px
        .el-submenu .el-menu-item
          min-width 160px
        .is-active
          .el-submenu__title
            i.iconfont, span
              color #016DFB
      .body-header
        overflow auto
        .el-input
          .el-input__inner
            font-size 12px
</style>
